import React from 'react'
import { Button, Input, Form, Toast } from 'react-vant'
import { useNavigate } from 'react-router-dom'
import axios from 'axios'
export default () => {
  const [form] = Form.useForm()
  const navigate = useNavigate()
  const onFinish = (values: any) => {
    console.log(values)
    axios.post("http://localhost:4000/register", values).then((res) => {
      console.log(res);
      Toast.info('注册成功')
      setTimeout(() => {
        navigate('/login')
      },1000)
    });
    // axios.post("/register", values).then((res) => {
    //   console.log(res);
    // });
  }
  // const register = () => {

  // }
  return (
    <div>
      <Form
        form={form}
        onFinish={onFinish}
        footer={
          <div style={{ margin: '16px 16px 0' }}>
            <Button round nativeType='submit' type='primary' block>
              注册
            </Button>
          </div>
        }>
        <Form.Item
          name='username'
          label='用户名'>
          <Input placeholder='请输入用户名' />
        </Form.Item>
        <Form.Item
          name='password'
          label='密码'>
          <Input placeholder='请输入密码' />
        </Form.Item>
        <Form.Item
          name='email'
          label='邮箱'>
          <Input placeholder='请输入邮箱' />
        </Form.Item>
        <Form.Item
          name='age'
          label='年龄'>
          <Input placeholder='请输入年龄' />
        </Form.Item>
        <Form.Item
          name='address'
          label='地址'>
          <Input placeholder='请输入地址' />
        </Form.Item>
      </Form>
    </div>

  )
}